<!DOCTYPE html>
<!-- saved from url=(0052)http://getbootstrap.com/docs/4.0/examples/dashboard/ -->
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>Dashboard Template for Bootstrap</title>
    <!-- Bootstrap core CSS -->
    <link th:href="@{/asserts/css/bootstrap.min.css}" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link th:href="@{/asserts/css/dashboard.css}" rel="stylesheet">
    <style type="text/css">
        /* Chart.js */

        @-webkit-keyframes chartjs-render-animation {
            from {
                opacity: 0.99
            }
            to {
                opacity: 1
            }
        }

        @keyframes chartjs-render-animation {
            from {
                opacity: 0.99
            }
            to {
                opacity: 1
            }
        }

        .chartjs-render-monitor {
            -webkit-animation: chartjs-render-animation 0.001s;
            animation: chartjs-render-animation 0.001s;
        }
    </style>
</head>

<body>

<nav th:replace="~{/commons/publicElement::topBar}">
    <!--
                th:insert ：将公共片段整个的插入到指定元素中。被引用的内容会完全在这里显示（nav标签里面还会再嵌套一个nav标签）
                th:replace：将声明引入的元素（本nav标签）替换为公共片段
                th:include：将被引入的片段的内容包含进这个标签中
    -->
</nav>
<div class="container-fluid">
    <div class="row">
        <!--		还可以通过css选择器来引用
                        <nav class="col-md-2 d-none d-md-block bg-light sidebar" id="leftNav" th:fragment="leftBar">
                        还可以在调用的时候传递参数进去
                        在目标thymeleaf，必须通过${}表达式才能取到该值
        -->
        <div th:replace="~{/commons/publicElement::#leftNav(activeUri='list.html')}"></div>

        <main role="main" class="col-md-9 ml-sm-auto col-lg-10 pt-3 px-4">
            <!--需要区分是员工修改还是添加；-->
            <form th:action="@{/item}" method="post">
                <!--发送put请求修改员工数据-->
                <!--
                    1、SpringMVC中配置HiddenHttpMethodFilter;（SpringBoot自动配置好的）
                2、页面创建一个post表单
                3、创建一个input项，name="_method";值就是我们指定的请求方式
                如果发现走的还是post的方式，多半是SpringBoot没有自动配置HiddenHttpMethodFilter
                手动创建一个HiddenHttpMethodFilter对象放到IOC容器中即可
                -->
                <input type="hidden" name="_method" value="put"/>
                <input type="hidden" name="id" th:value="${itemForEdit.id}">
                <div class="form-group">
                    <label>title</label>
                    <input name="title" type="text" th:value="${itemForEdit.title}" class="form-control"
                           placeholder="zhangsan">
                </div>
                <div class="form-group">
                    <label>现有数量</label>
                    <input name="num" type="number" th:value="${itemForEdit.num}" class="form-control"
                           placeholder="zhangsan@atguigu.com">
                </div>
                <div class="form-group">
                    <label>status</label><br/>
                    <div class="form-check form-check-inline">
                        <input class="form-check-input" type="radio" name="statusCheck" value="1"
                               th:checked="${itemForEdit.status==0}">
                        <label class="form-check-label">上架</label>
                    </div>
                    <div class="form-check form-check-inline">
                        <input class="form-check-input" type="radio" name="statusCheck"
                               th:checked="${itemForEdit.status==1}">
                        <label class="form-check-label">已下架</label>
                    </div>
                </div>
                <div class="form-group">
                    <label>department</label>
                    <!--提交的是部门的id-->
                    <select class="form-control" name="panelContentId">
                    </select>
                </div>
                <div class="form-group">
                    <label>created</label>
                    <!--                    使用<input name="created" type="date" 则不能保证日期的格式是2019/01/02-->
                    <input name="created" th:value="${#dates.format(itemForEdit.created,'yyyy/MM/dd')}" type="text" class="form-control" placeholder="zhangsan">
                </div>
                <button type="submit" class="btn btn-primary">确认更新</button>
            </form>
        </main>
    </div>
</div>

<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script type="text/javascript" th:src="@{/asserts/js/jquery-3.2.1.slim.min.js}"></script>
<script type="text/javascript" th:src="@{/asserts/js/popper.min.js}"></script>
<script type="text/javascript" th:src="@{/asserts/js/bootstrap.min.js}"></script>

<!-- Icons -->
<script type="text/javascript" th:src="@{asserts/js/feather.min.js}"></script>


<!-- Graphs -->
<script type="text/javascript" th:src="@{asserts/js/Chart.min.js}"></script>
<!--<script>
    var ctx = document.getElementById("myChart");
    var myChart = new Chart(ctx, {
        type: 'line',
        data: {
            labels: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
            datasets: [{
                data: [15339, 21345, 18483, 24003, 23489, 24092, 12034],
                lineTension: 0,
                backgroundColor: 'transparent',
                borderColor: '#007bff',
                borderWidth: 4,
                pointBackgroundColor: '#007bff'
            }]
        },
        options: {
            scales: {
                yAxes: [{
                    ticks: {
                        beginAtZero: false
                    }
                }]
            },
            legend: {
                display: false,
            }
        }
    });
</script>-->

</body>

</html>